import Vue from 'vue'
import App from './App.vue'
import VueRouter from "vue-router";
import VueResource from 'vue-resource'
import Element from  'element-ui'
import 'element-ui/lib/theme-default/index.css'
Vue.use(Element)

//on debug
Vue.config.debug = true;

Vue.use(VueRouter);
Vue.use(VueResource);


//defing compont . import from other file also.
const First = { template: '<div><h2>This is my first vue page.</h2></div>' }
import secondcomponent from './component/secondcomponent.vue'



//create route instance
//config route rules.
const router = new VueRouter({
  mode: 'history',
  base: __dirname,
  routes: [
    {
      path: '/first',
      component: First
    },
    {
      path: '/second',
      component: secondcomponent
    }
  ]
})



// now we can startup this app！
// route will create an app instance and fork to #app element.
const app = new Vue({
  router: router,
  render: h => h(App)
  // components: { firstcomponent, secondcomponent }
}).$mount('#app')
